<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<!-- 异步任务又被分为微任务和宏任务 -->
		<!-- 宏任务有
		 setTimeout
		 setInterval
		 Ajax请求
		 UI事件（click、scroll等）
		 setImmediate（Node.js）
		 文件读取操作
		 -->
		 <!-- 微任务有
		 Promise.then/catch/finally
		 MutationObserver
		 process.nextTick（Node.js）
		  -->
		  <!-- 
			宏任务微任务区别
			
		   -->
		  <!-- 
		  promise对象有三种状态
		  pending等待中
		  fulfilled已成功
		  rejected已失败
		  
		  promise缺点：
		  1、无法取消它，一旦建立就会立即执行，没办法中途取消
		  2、如果不给它设置回调函数，内部的抛出错误没办法显示
		  3、当处于pending状态的时候，无法得知当前进展到哪一地步（是刚开始还是刚结束的状态）
		   -->
		<script>
			// function greet(){
			//   var promise = new Promise(function(resolve,reject){
			//     var greet = "hello world"
			//     resolve(greet)
			// })
			//   return promise
			// }
			// greet().then(v=>{
			//   console.log(v)//*
			//     return '1234567'
			// }).then(v=>{
			//   console.log(v)//*
			// })


			// new Promise(function (resolve, reject) {
			//     console.log(1111);
			//     resolve(2222);
			//     // reject(2222);
			// }).then(function (value) {
			//     console.log(value);
			//     throw "An error";
			//     // return 3333;
			// }).then(function (value) {
			//     console.log(value);
			//     throw "An error";
			// },function (value) {
			//     console.log(value);
			//     return 3333;
			// }).catch(function (err) {
			//     console.log(err);
			// });


			// function judgeNumber(num){
			//     var promise1 = new Promise(function(resolve,reject){
			// 		// console.log(num);
			//   //       num =5;
			//         if(num<5){
			//             resolve("num小于5，值为："+num);
			//         }else{
			//             reject("num不小于5，值为："+num);
			//         }
			//     });
			//     return promise1;
			// }

			// judgeNumber(10).then(
			//     function(message){
			//         console.log(message);
			//     }
			// )
			// .catch(function(message){
			//     console.log(message);
			// })
			
			
			
			
			
			/**
			 * Promise.all([p1(), p2(), p3()])  属于同步，立即按顺序执行方法里的代码
			 * 这里的微任务1需要三个方法都执行resolve回调函数才会执行，所以在等待中。
			 * 
			 * p1的第一条输出语句
			 * p1的第二条输出语句
			 * p2的第一条输出语句
			 * p3的第一条输出语句
			 * p3的第二条输出语句
			 * p2的第二条输出语句
			 *  ['p1完成', 'p2完成', 'p3完成']
			 * */ 
			// function p1() {
			// 	var promise1 = new Promise(function(resolve, reject) {
			// 		console.log("p1的第一条输出语句");
			// 		console.log("p1的第二条输出语句");
			// 		resolve("p1完成");
			// 	})
			// 	return promise1;
			// }

			// function p2() {
			// 	var promise2 = new Promise(function(resolve, reject) {
			// 		console.log("p2的第一条输出语句");
			// 		setTimeout(() => {//宏任务1
			// 			console.log("p2的第二条输出语句");
			// 			reject("p2完成")
			// 		}, 2000);

			// 	})
			// 	return promise2;
			// }

			// function p3() {
			// 	var promise3 = new Promise(function(resolve, reject) {
			// 		console.log("p3的第一条输出语句");
			// 		console.log("p3的第二条输出语句");
			// 		resolve("p3完成")
			// 	});
			// 	return promise3;
			// }
			
			// var p = Promise.all([p1(), p2(), p3()])//同步1
			// .then(function(data) {//微任务1
			// 	console.log(data);
			// })
			// .catch((res)=>{
			// 	console.log(res)
			// })
			// console.log(p)
			// Promise.all([p1(), p2(), p3()])//同步1
			// .then(function(data) {//微任务1
			// 	console.log(data);
			// },function(data) {
			// 	console.log(data);
			// })
			
			
			
			/**
			 * promise1.then()没有执行，因为promise1中为未执行resolve函数或者reject函数
			 * 
			 * start
			 * 1
			 * end
			 * */ 

			// console.log('start');

			// const promise1 = new Promise((resolve, reject) => {
			// 	console.log(1)
			// })

			// promise1.then(res => {
			// 	console.log(2)
			// }).catch(function(message) {
			// 	console.log(message);
			// })

			// console.log('end');
			
			
			
			
			
			/*
			*promise1.then()第一个微任务没有被执行，是因为构造函数中的resolve回调函数没有执行，还在等待状态
			* 宏任务1，加了时间，所以没有立即执行，而是等到1秒过去才执行
			* 
			* 
			* start
			* promise1
			* end
			* resolve
			* 4
			* promisefinally
			* setTimeout2
			* setTimeout3
			* then1
			* then2
			* promise1finally
			* setTimeout4
			* setTimeout1
			* */ 
			
			// console.log('start')                                         //同步1

			// setTimeout(() => {                                           //宏任务1
			// 	console.log('setTimeout1')
			// },1000)

			// setTimeout(() => {                                           //宏任务2
			// 	console.log('setTimeout2')
			// })
			// const promise1 = new Promise((resolve, reject) => {
			// 	console.log('promise1')                                     //同步2
			// 	setTimeout(() => {                                           //宏任务3
			// 		resolve("then2")
			// 		console.log('setTimeout3')
			// 	})
			// })
			// promise1.then((res)=>{                                           //微任务1
			// 	console.log("then1")
			// 	console.log(res)
			// }).finally(() => {
			// 	console.log("promise1finally")
			// })
			// Promise.resolve().then(() => {                                      //微任务2
			// 	console.log('resolve')
			// 	setTimeout(() => {                                               //宏任务4
			// 		console.log('setTimeout4')
			// 	})
			// 	return 4
			// }).then((res) => {                                                   //微任务3
			// 	console.log(res)
			// }).finally(() => {
			// 	console.log("promisefinally")
			// })

			// console.log('end')                                              //同步3
			
			
			
			
			
			
			
			
			
			
			
			
			/**
			 * 
			 * 微任务可以在事件循环运行机制（Event Loop）中插队
			 * 微任务优先级大于宏任务
			 * timer1
			 * promise1
			 * timer2
			 * */ 
			
			// const timer1 = setTimeout(() => {                                               //宏任务1
			//   console.log('timer1');                               
			
			//   const promise1 = Promise.resolve().then(() => {                              //微任务1
			//     console.log('promise1')
			//   })
			// }, 0)
			
			// const timer2 = setTimeout(() =>  {                                               //宏任务2
			//   console.log('timer2')  
			// }, 0)
			
			
			
			
			/**
			 *  start
			 *  end
			 * promise1
			 * timer1
			 * promise2
			 * timer2
			 */ 
			
			
			// console.log('start');
			
			// const promise1 = Promise.resolve().then(() => {
			//   console.log('promise1');
			//   const timer2 = setTimeout(() => {
			//     console.log('timer2')
			//   }, 0)
			// });
			
			// const timer1 = setTimeout(() => {
			//   console.log('timer1')
			//   const promise2 = Promise.resolve().then(() => {
			//     console.log('promise2')
			//   })
			// }, 0)
			
			// console.log('end');
		</script>
	</body>
</html>